<template>
	<div>
		<a-form class="ant-advanced-search-form home-form" :form="form" @submit="handleSearch" v-if="currentType!='user' && currentType!='manager'">
			<a-row :gutter="24">
				<a-col :span="8">
					<a-form-item label="假期">
						<a-select
							v-decorator="['sessionID']"
							placeholder="全部"
							optionFilterProp="children"
							showSearch
							@change="SessionIDFun"
						>
							<a-select-option v-for="(item, index) in SessionIDList" :key="item.ID" :value="item.ID">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-item>
				</a-col>
				<a-col :span="8">
					<a-form-item label="假期申报项">
						<a-select
							v-decorator="['sessionDeclareID']"
							placeholder="全部"
							optionFilterProp="children"
							showSearch
						>
							<a-select-option v-for="(item, index) in sessionDeclareIDList" :key="item.ID" :value="item.ID">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-item>
				</a-col>
				
				<a-col :span="8">
					<a-form-item label="所属学院">
						<a-select v-decorator="['departCode']" showSearch optionFilterProp="children">
							<a-select-option v-for="(item, index) in DepartCodeList" :key="item.Code" :value="item.Code">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-item>
				</a-col>
				<ClubSearch :span="8" label="申请人" name="applyUserNo" ref="applyUserNo" @tap="searchValueFun"></ClubSearch>
				<a-col :span="8">
					<a-form-item label="提交时间"><a-range-picker show-time v-decorator="['data']" /></a-form-item>
				</a-col>
			</a-row>
		</a-form>
		<a-button-group class="btngroupoption" v-if="currentType!='user'&&currentType!='manager'">
			<a-button type="primary" @click="handleSearch">搜索</a-button>
			<a-button @click="handleReset">重置</a-button>
			<a-button type="primary" class="btn" @click="allApplyHander" v-if="currentState==0">批量审核</a-button>
		</a-button-group>
		<div class="table">
			<el-table :data="data" v-loading="loading" :border="$route.name.includes('Home')" highlight-current-row style="width: 100%;" v-if="currentType=='user'">
				<el-table-column type="index" label="序号" width="60" align="center"></el-table-column>
				<el-table-column prop="ApplyRole" label="申请角色" min-width="140" align="center"></el-table-column>
				<el-table-column prop="Name" label="名称" min-width="140"></el-table-column>
				<el-table-column prop="IsApply" label="申请状态" min-width="120" align="center">
					<template slot-scope="scope"><a-tag :color="scope.row.IsApply?'red':'blue'">{{ scope.row.IsApply?'已申请':'未申请' }}</a-tag></template>
				</el-table-column>
				<el-table-column prop="TeamDeclareStateName" label="审核状态" min-width="120" align="center"></el-table-column>
				<el-table-column label="操作" min-width="180" fixed="right">
					<template slot-scope="scope">
						<div class="tableleft" v-if="$route.name.includes('Home')">
							<oprateBtn title="撤销" v-if="scope.row.TeamDeclareState==1" icon="icon-B" color="red" @tap="setList(scope.row, 2)" ></oprateBtn>
							<oprateBtn title="申报" v-if="!scope.row.IsApply" icon="icon-tijiao" color="#1890FF" @tap="newseeList(scope.row, 1)" ></oprateBtn>
							<oprateBtn title="详情" v-if="scope.row.IsApply" icon="icon-xiangqing" color="#1890FF" @tap="seeList(scope.row, 3)" ></oprateBtn>
							<oprateBtn title="修改" v-if="scope.row.TeamDeclareState==2" icon="icon-editor1" color="#1890FF" @tap="seeList(scope.row, 2)" ></oprateBtn>
							<oprateBtn title="删除" v-if="scope.row.TeamDeclareState==2" icon="icon-delete" color="red" @tap="setList(scope.row,1)" ></oprateBtn>
						</div>
						<div class="user-btn user-btn-auto" v-else>
							<span class="cancel" v-if="scope.row.TeamDeclareState==1" @click="setList(scope.row, 2)">撤销</span>
							<span class="adopt" v-if="!scope.row.IsApply" @click="newseeList(scope.row, 1)">申报</span>
							<span class="detail" v-if="scope.row.IsApply" @click="seeList(scope.row, 3)">详情</span>
							<span class="modify" v-if="scope.row.TeamDeclareState==2" @click="seeList(scope.row, 2)">修改</span>
							<span class="delete" v-if="scope.row.TeamDeclareState==2" @click="setList(scope.row,1)">删除</span>
						</div>
					</template>
				</el-table-column>
			</el-table>
			<el-table :data="data" v-loading="loading" :border="$route.name.includes('Home')" highlight-current-row style="width: 100%;" @selection-change="handleSelectionChange" v-else>
				<el-table-column type="selection" width="55" fixed="left" v-if="currentState==0"></el-table-column>
				<el-table-column type="index" label="序号" width="60" align="center"></el-table-column>
				<el-table-column prop="SessionDeclareName" label="名称" min-width="140"></el-table-column>
				<el-table-column prop="DepartName" label="部门" min-width="140" v-if="currentType!='manager'" align="center"></el-table-column>
				<el-table-column prop="TeamNo" label="团队编号/名称" min-width="240" v-if="currentType!='manager'" align="center">
					<template slot-scope="scope">
						<div>{{ scope.row.TeamNo }}</div>
						<div>{{ scope.row.TeamTitle }}</div>
					</template>
				</el-table-column>
				<el-table-column prop="AddUserNo" label="申请人" min-width="140" v-if="currentType!='manager'" align="center">
					<template slot-scope="scope">
						<div>{{ scope.row.AddUserNo }}</div>
						<div>{{ scope.row.AddUserName }}</div>
					</template>
				</el-table-column>
				<el-table-column prop="TypeName" label="审批类型" min-width="140" v-if="currentType!='manager'" align="center"></el-table-column>
				<el-table-column prop="AddTime" label="申报时间" min-width="140" v-if="currentType=='manager'" align="center"></el-table-column>
				<el-table-column prop="StateName" label="状态" min-width="140" v-if="currentType=='manager'" align="center"></el-table-column>
				<el-table-column label="操作" min-width="140" fixed="right">
					<template slot-scope="scope">
						<div class="tableleft" v-if="$route.name.includes('Home')">
							<oprateBtn title="详情" v-if="currentType!='manager'" icon="icon-xiangqing" color="#1890FF" @tap="seeList(scope.row, 3)" ></oprateBtn>
							<oprateBtn v-if="currentState==0&&currentType!='manager'" title="审批" icon="icon-shenpi" color="green" @tap="seeList(scope.row, 4)" ></oprateBtn>
							<oprateBtn v-if="scope.row.State==3&&currentType==='manager'" title="补发学分" icon="icon-xuefen" color="red" @tap="setList(scope.row, 3)" ></oprateBtn>
						</div>
						<div class="user-btn user-btn-auto" v-else>
							<span class="detail"  @click="seeList(scope.row, 3)">详情</span>
							<span class="examine" v-if="currentState==0&&currentType!='manager'" @click="seeList(scope.row, 4)">审批</span>
							<span class="signin" v-if="scope.row.State==3&&currentType==='manager'" @click="setList(scope.row, 3)">补发学分</span>
						</div>
					</template>
				</el-table-column>
			</el-table>
			<pagination @handleSizeChange="handleSizeChange" @handleCurrentChange="handleCurrentChange" :pagination="pagination"></pagination>
		</div>
		<add :text="text" v-show="addIf" :currentType="currentType" @closeFun="closeFun"></add>
	</div>
</template>

<script>
import add from './add';
import pagination from '@components/pagination/index.vue';
import ClubSearch from '@/components/SearchForm/ClubSearch.vue'
import moment from 'moment';
import Cache from '@/utils/cache';
import { ManagePracticeTeamDeclare,UserPracticeTeamDeclare,ManagePracticeTeamDeclareFlow,GetDepartList,CommonDoGetPracticeSessionList,Common } from '@/api/follow';
export default {
	props: {
		currentType: String,
		currentState:Number
	},
	components: {
		add,
		pagination,
		ClubSearch
	},
	data() {
		return {
			UserInfo: Cache.get('myInfo'),
			data: [{IsApply:true}],
			loading: false,
			form: this.$form.createForm(this, {
				name: 'advanced_search'
			}),
			pagination: this.global.pagination,
			addIf: false,
			text: {},
			values: {},
			multipleSelection:[],
			DepartCodeList:[],
			SessionIDList:[],
			sessionDeclareIDList:[]
		};
	},
	async created() {
		this.getList();
		this.getOtherList();
	},
	methods: {
		moment,
		async SessionIDFun(e){
			if(e){
				this.form.setFieldsValue({
					sessionDeclareID: undefined
				})
				this.sessionDeclareIDList = (await Common('DoGetPracticeSessionDeclareList',{sessionID:e})).data.data
			}
		},
		searchValueFun(name,value){
			this.values = { ...this.values,[name]:value }
		},
		handleSelectionChange(val) {
			this.multipleSelection = val;
		},
		allApplyHander(){
			if(this.multipleSelection.length==0){
				this.$message.error('请选择要处理的数据！')
				return false
			}
			this.seeList({ID:this.multipleSelection.map((item)=>{return item.ID}).join(','),textArr:this.multipleSelection},4)
		},
		async getOtherList(){
			if(this.currentType=='collegeFlow'){
				this.DepartCodeList = (await ManagePracticeTeamDeclareFlow('DoGetCollegeExamDepartList',{})).data.data
			}
			if(this.currentType=='schoolFlow'){
				this.DepartCodeList = (await ManagePracticeTeamDeclareFlow('DoGetSchoolExamDepartList',{})).data.data
			}
			this.SessionIDList = (await CommonDoGetPracticeSessionList()).data.data
		},
		handleSearch(e) {
			e.preventDefault();
			this.form.validateFields((error, values) => {
				this.pagination.currentPage = 1;
				if (values.data&&values.data.length>0) {
					values.startDate = values.data[0].format('YYYY-MM-DD HH:mm:ss')
					values.endDate = values.data[1].format('YYYY-MM-DD HH:mm:ss')
				}
				this.values = {
					...this.values,
					...values
				};
				this.getList();
			});
		},
		handleReset() {
			this.form.resetFields();
			this.$refs.applyUserNo.value = undefined
			this.values = {};
			this.getList()
		},
		handleSizeChange(val) {
			this.pagination.pageSize = val;
			this.getList();
		},
		handleCurrentChange(val) {
			this.pagination.currentPage = val;
			this.getList();
		},
		async getList() {
			this.loading = true;
			let data = {};
			data = { ...this.values,teamID:this.$route.query.ID, pageIndex: this.pagination.currentPage, pageSize: this.pagination.pageSize };
			let res = {};
			if(this.currentType=='user'){
				res = await UserPracticeTeamDeclare('DoGetList',data);
			}
			if(this.currentType=='manager'){
				res = await ManagePracticeTeamDeclare('DoGetList',data);
			}
			if(this.currentType == 'collegeFlow' && this.currentState==0){
				res = await ManagePracticeTeamDeclareFlow('DoGetCollegeExamPageList',data);
			}
			if(this.currentType == 'collegeFlow' && this.currentState==1){
				res = await ManagePracticeTeamDeclareFlow('DoGetCollegeAlreadyExamPageList',data);
			}
			if(this.currentType == 'schoolFlow' && this.currentState==0){
				res = await ManagePracticeTeamDeclareFlow('DoGetSchoolExamPageList',data);
			}
			if(this.currentType == 'schoolFlow' && this.currentState==1){
				res = await ManagePracticeTeamDeclareFlow('DoGetSchoolAlreadyExamPageList',data);
			}
			this.loading = false;
			this.data = res.data.data;
			const pagination = { ...this.pagination };
			pagination.total = res.data.pageInfo?res.data.pageInfo.TotalItemCount:0;
			this.pagination = pagination;
		},
		newseeList(text,listType){
			this.text = {
				listType:listType,
				TeamID:this.$route.query.ID,
				SessionDeclareID:text.ID,
				currentType: this.currentType,
				time: new Date()
			};
			console.log(this.text)
			this.addIf = !this.addIf;
		},
		seeList(text, listType) {
			this.text = {
				...text,
				listType:listType,
				TeamID:this.$route.query.ID,
				SessionDeclareID:text.ID,
				currentType: this.currentType,
				time: new Date()
			};
			console.log(this.text)
			this.addIf = !this.addIf;
		},
		setList(text,type) {
			let that = this;
			this.$confirm({
				title: '提示',
				content: type==1?`您确定删除该数据吗？`:type==2?`您确定撤回该数据吗？`:'您确定给该申报补发学分吗？',
				okText: '确认',
				cancelText: '取消',
				async onOk() {
					let data = {};
					let res = {}
					if (that.currentType == 'manager') {
						data.id = text.ID;
						res = await ManagePracticeTeamDeclare('DoSendScore',data)
					}
					if (that.currentType == 'user') {
						data.id = text.TeamDeclareID;
						res = type==1?await UserPracticeTeamDeclare('DoDelete',data):await UserPracticeTeamDeclare('DoRevoke',data)
					}
					that.$message[res.data.code==0?'success':'error'](res.data.msg);
					if (res.data.code == 0) {
						that.getList();
					}
				}
			});
		},
		goList(item,name){
			this.$router.push({
				name: this.currentType=='manager'?name:'User'+name,
				query: {
					ID: item.ID,
				}
			});
		},
		closeFun(data) {
			this.addIf = false;
			if (data == 1) {
				this.getList();
			}
		}
	}
};
</script>
